@extends('admin.layouts.admin')
@section('content')
    <div class="layui-form" lay-filter="LAY-edit-forms" id="LAY-edit" style="padding: 20px 30px 0 0;">
        <div class="layui-form-item">
            <label class="layui-form-label">分类昵称</label>
            <div class="layui-input-block">
                <input type="text" name="title" lay-verify="title" autocomplete="off" placeholder="请输入标题" class="layui-input" value="{{$data->title}}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">分类字段</label>
            <div class="layui-input-block">
                <input type="text" name="eng_title" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input" value="{{$data->eng_title}}">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">图标</label>
            <div class="layui-input-block">
                <input type="text" id="iconPicker" name="icon" lay-filter="iconPicker" value="{{$data->icon}}" style="display:none;">
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">类型</label>
            <div class="layui-input-block">
                @foreach($config_category_tab_type as $key => $value)
                    <input type="radio" name="type" value="{{$key}}" @if($key==$data->type) checked @endif title="{{$value}}">
                @endforeach
            </div>
        </div>
        <div class="layui-form-item">
            <label class="layui-form-label">状态</label>
            <div class="layui-input-block">
                <input type="checkbox" name="status" id="status" lay-skin="switch" lay-filter="switchTest" value="1|2" checked lay-text="显示|隐藏">

            </div>
        </div>

        <div class="layui-form-item layui-hide">
            <input type="button" lay-submit lay-filter="LAY-edit-forms" id="LAY-edit-forms" value="确认">
        </div>
    </div>

@endsection
@section('scripts')
    <script>
        layui.config({
            base: '../' //静态资源所在路径
        }).extend({
            iconPicker: '../lib/extend/iconPicker'
        }).use([ 'table', 'form', 'layer' ,'iconPicker', 'util'], function(){
            var $ = layui.$
                ,form = layui.form
                ,layer = layui.layer
                ,iconPicker = layui.iconPicker;
            form.render('checkbox');

            iconPicker.render({
                // 选择器，推荐使用input
                elem: '#iconPicker',
                // 数据类型：fontClass/unicode，推荐使用fontClass
                type: 'fontClass',
                // 是否开启搜索：true/false，默认true
                search: true,
                // 是否开启分页：true/false，默认true
                page: true,
                // 每页显示数量，默认12
                limit: 12,
                // 每个图标格子的宽度：'43px'或'20%'
                cellWidth: '43px',
                // 点击回调
                click: function (data) {
                    console.log(data);
                },
                // 渲染成功后的回调
                success: function(d) {
                    console.log(d);
                }
            });

            /**
             * 选中图标 （常用于更新时默认选中图标）
             * @param filter lay-filter
             * @param iconName 图标名称，自动识别fontClass/unicode
             */
            var checkIcon = $('#iconPicker').val();
            if(!checkIcon){
                iconPicker.checkIcon('iconPicker', 'layui-icon-star-fill');
            }else{
                iconPicker.checkIcon('iconPicker', checkIcon);
            }


        });//use

    </script>
@stop
